import { h, Component } from 'preact';
import { connect } from 'preact-redux';
import { Router } from 'preact-router';
import history from '~/core/history';
import Loading from '~/components/Loading';
import { getCookInfo, getMyinfo, getMyWxinfo, getWxSignature } from '~/api';

import Home from '~/containers/Home';
import CardHolder from '~/containers/CardHolder';
import Organization from '~/containers/Organization';
import OrganizationDetail from '~/containers/OrganizationDetail';
import UserCenter from '~/containers/UserCenter';
import Create from '~/containers/Create';
import Works from '~/containers/Works';
import Invitation from '~/containers/Invitation';
import { setUser } from '~/containers/Works';
import Card from '~/containers/Card';
import Message from '~/containers/Message';

import { parse } from 'query-string';

import * as cookerAction from '~/action/user';
import { bindActionCreators } from 'redux';

import Resume from '~/containers/Resume';
import BaseInfo from '~/containers/BaseInfo';

import Modal from '~/components/Modal';

import './../styles/global.common';

import {wechatInfo, authUrl} from '~/config';
import wechat, {share} from '~/utils/wechat';

const url = window.location.href.split('#');

const wxconfig = {
	debug: '',
	appId: wechatInfo.appId,
	timestamp: null,
	nonceStr: null,
	signature: null,
	jsApiList: wechatInfo.jsApiList
};

class App extends Component {
	constructor() {
		super();
		this.state = {
			showModal: false,
			message: null
		};
	}


	componentWillMount() {
		// this.getCookInfo();
		this.getMyinfo();
	}


	componentDidMount() {
		this.getWxSignature(url[0]);
	}

	showModal = (message) => {
		this.setState({
			message,
			showModal: true
		});
	}

	getWxSignature = (url) => {
		getWxSignature(url).then(res => {
			const wxconfig = {
				debug: false,
				appId: res.appId,
				timestamp: res.timestamp,
				nonceStr: res.nonceStr,
				signature: res.signature,
				jsApiList: wechatInfo.jsApiList
			};
			wechat(wxconfig).then((res) => {
				share({
					title: wechatInfo.title,
					link: `${authUrl}?state=index_`,
					imgUrl: wechatInfo.imgUrl,
					desc: wechatInfo.desc
				});
			});
		}).catch();
	}

	getCookInfo = () => {
		Loading.show();
		getCookInfo('1').then(res => {
			Loading.hide();
			this.props.setUser(res);
		}).catch((res) => {
			Loading.hide();
			this.showModal(res.message || '网络异常！请重试');
		});
	}

	getMyinfo = () => {
		Loading.show();
		getMyinfo().then(res => {
			Loading.hide();
			this.props.setUser(res);
			// newUrl();
		}).catch((res) => {
			// this.showModal(res.message || '网络异常！请重试');
			getMyWxinfo().then((resp) => {
				Loading.hide();
				const {
					openid,
					sex,
					headimgurl,
					nickname,
					province,
					city,
					country
				} = resp;

				const data = {
					openid,
					sex,
					headimgurl,
					name: nickname,
					province,
					city,
					country
				};

				this.props.setUser(data);
				// newUrl();
			}).catch((res) => {
				Loading.hide();
				this.showModal(res.message || '网络异常！请重试');
			});

		});
	}

	handleUser = (user) => {
		this.setState({user});
	}

	render() {
		return (
			<div id="app">
				<Router history={history}>
					<Home path="/" />
					<CardHolder path="/cardholder" />
					<Create path="/create" />
					<Card path="/card" />
					<BaseInfo path="/baseinfo" />
					<Resume path="/resume" />
					<Works path="/works" />
					<Invitation path="/invitation" />
					<Organization path="/organization"/>
					<OrganizationDetail path="/orgd" />
					<UserCenter path="/usercenter" />
					<Message path="/message" />
					<Home default />
				</Router>
				<Modal
					contentLabel="Modal"
					isOpen={this.state.showModal}
					onRequestClose={() => {this.setState({showModal: false});}}
					shouldCloseOnOverlayClick={true}
				>
					<h3 className="al-c pdt3">{this.state.message}</h3>
				</Modal>
			</div>
		);
	}
}

function mapStateToProps(state) {
	return {
		user: state.user
	};
}

function mapDispatchToProps(dispatch) {
	return bindActionCreators({
		setUser: cookerAction.setUser
	}, dispatch);
}

export default connect(mapStateToProps, mapDispatchToProps)(App);
